<template>
	<!-- 渲染文字在左 图片在右边的图文消息 -->
 <view>
	<view v-if="msginfo.whocss=='aui-chat-right'" 
	class="cu-item aui-chat-right">
	    <view class="main">    
	      <view class="content shadow">
	       <view class="u-flex">
			  <view class="u-m-r-10">
			  	 <u-image  width="60" height="60"  radius="3" :lazy-load="true" :src="msginfo.image"></u-image>
			  </view>
			  <view>
			  	  <u-text lines="3" :text="msginfo.content"></u-text> 
			  </view>
		   </view> 
	      </view>
	    </view>
	    <view class="cu-avatar radius" >
		<u-avatar :src="msginfo.thumb"  shape="square"></u-avatar>
		
		</view>
	    <view class="date"> {{msginfo.addtime}}</view>
	  </view>
	<!-- 显示左边 排列样式 -->
	  <view v-else class="cu-item aui-chat-left">
		  
	    <view class="cu-avatar radius"  style="">
		 <u-avatar :src="msginfo.thumb"  shape="square"></u-avatar>
		 </view>
		  
	    <view class="main">
	      <view class="content shadow">
			  <view class="u-flex">
				  <view>
				  <u-text lines="3" :text="msginfo.content"></u-text> 
				  </view>
				   <view class="u-m-l-10">
					   <u-image  width="60" height="60"  radius="3" :lazy-load="true" :src="msginfo.image"></u-image>
				   </view>
				  
			  </view> 
	        <!-- 内容 -->
	      </view>
	    </view>
	    <view class="date "> {{msginfo.addtime}}</view>
	  </view>
	  
</view>
</template>

<script>
	export default {
		name:"message-text",
		props:{
			msginfo :{
				type:Object,
				default:{},
			}
		},
		data() {
			return {
				
			};
		}
	}
</script>

<style>

	 @import url("@/static/tallk.css");
</style>